<template>
  <div class="itemList">
    <div class="item" v-for="(item, index) in itemList" :key="index">
      <div class="itemTitle">{{item.sub_title}}</div>
      <div class="linkList">
        <a class="link" href="#" v-for="(item1, index1) in item.sub_dh_list" :key="index1">{{item1}}</a>
      </div>
    </div>
 </div>
</template>

<script>
export default {
  name: 'gl_zttj',
  data() { 
    return {

    }
  },
  props: {
    itemList: {}
  },
  components:{
  },
  methods:{

  },
  mounted() {

  },
 }
</script>

<style lang="scss" scoped>
.itemList {
  display: none;
  width: 470px;
  padding: 18px;
  background-color: #fff;
  border: 1px solid #ccc;
  .item {
    display: flex;
    font-size: 12px;
    padding: 5px 0;
    .itemTitle {
      width: 70px;
      font-weight: bold;
      cursor: default;
    }
    .linkList {
      display: flex;
      flex-wrap: wrap;
      .link {
        padding: 3px 8px;
        color: #666;
        &:hover {
          color: #ff9d00;
          text-decoration: underline;
        }
      }
    }
  }
}
</style>